<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%> 
<%@taglib uri="/WEB-INF/MyPage.tld" prefix="pt"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE html>
<html>
<head>
<title>蜂窝煤游记详情</title>
<link href="CSS/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery.min.js"></script>
<!-- Custom Theme files -->
<!--theme-style-->
<link href="CSS/style.css" rel="stylesheet" type="text/css" media="all" />	
<!--//theme-style-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Whizz Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!--flexslider-->
<link rel="stylesheet" href="CSS/flexslider.css" type="text/css" media="screen" />
<!--//flexslider-->

<script type="text/javascript">

function saysomething(){
var saywhat =document.forms["saysomething"]["getsaysomething"].value;
 if(saywhat==""||saywhat==null){
 return false;
 }else if(saywhat.length>200){
 return false;;
 }else{
 return true;
 }


}


function getotherpage(op){
var diaryid = "${requestScope.diary.diary_id}";
var pageIndex=document.getElementById("pagehidden").value;
	var pageCount=1;
	if(${requestScope.pageCount!=null}){
		pageCount=${requestScope.pageCount};
		}	
	if(op=="first"){
		pageIndex=1;
	}else if(op=="reduceone"){
		pageIndex=parseInt(pageIndex)-1;
	}else if(op=="addone"){
		pageIndex=parseInt(pageIndex)+1;
	}else if(op=="end"){
		pageIndex=pageCount;		
	}
		if(pageIndex<1){
		pageIndex=1;
		}
		if(pageIndex>pageCount){
		pageIndex=pageCount;
		}
$.getJSON("DiaryDetailServlet",{flag:"getotherdiarycompage",otherpage:pageIndex,diaryid:diaryid},function(data){
	var str="";
	for(var i=0;i<data.length;i++){
	var userlogo = "";
		if(data[i].diarycom_user.user_logo!='/null'){
		userlogo="<img class='diarydetailuserlogo' src='diaryimage"+data[i].diarycom_user.user_logo+"'  style='height:45px;'>";
		}else if(data[i].diarycom_user.user_logo=='/null'){
		userlogo="<img class='diarydetailuserlogo' src='image/userlogo.png'  style='height:45px;'>";
		}
			str=str+"<div class='diarycomdiv'>"+
					userlogo+
					"<lable>"+data[i].diarycom_user.user_name+"</lable><br>"+
					"<table>"+data[i].diarycom_content+"</table>"+
						"<div class='timeandfloat'><table style='color: gray;'>"+
						  ((i+1)+5*(pageIndex-1))+
						"楼&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"+
						data[i].diarycom_time+"</table></div></div>	";
	}
	$("#setdiarycombypage").html(str);
	$("#nowpagenum").html(pageIndex);
});
	document.getElementById("pagehidden").value=pageIndex;


}


</script>

<style type="text/css">
	.diarydetailuserlogo{
	border-radius:50%
	}
	.timeandfloat{
	float: right;
	}
	.diarycomdiv{
	margin-bottom: 50px;
	}

</style>
</head>
<body>

<!--content-->
		 <div class="single">
			<div class="container">
			
			<div class="col-md-8 ">
				<div class=" single-grid">
					<a href="#">
					<c:if test="${requestScope.diary.diary_logo!='/null'}">
					<img class="img-responsive" src="diaryimage${requestScope.diary.diary_logo}" width="729px" height="729px"/>
					</c:if>
					<c:if test="${requestScope.diary.diary_logo=='/null'}">
					<img class="img-responsive" src="image/diarylogo.jpg" width="729px" height="729px"/>
					</c:if>
					</a>
					<div class="lone-line">
						<h4>${requestScope.diary.diary_title}</h4>
						<div class="cal">
							<ul>
								<li><span ><i class="glyphicon glyphicon-calendar"> </i>${requestScope.diary.diary_time}</span></li>
								<li><a href="#" ><i class="glyphicon glyphicon-comment"></i>${requestScope.diary.diaryComNum}</a></li>
							</ul>
						</div>
						<table>${requestScope.diary.diary_content}</table>
					</div>
				</div>
			<input type="hidden" id="pagehidden" value="1">
			<div class=" single-profile">
				<h4> 评论</h4>
				<div class="single-left "  id="setdiarycombypage" style="height: 730px;">			
				
				<c:if test="${fn:length(requestScope.mylist)==0}">
				<font>还没人留言哦,说点什么吧</font>
				</c:if>
				
				<c:forEach var="mylist" items="${requestScope.mylist}" varStatus="status"> 
					<div class="diarycomdiv">
					<c:if test="${mylist.diarycom_user.user_logo!='/null'}">
					<img class="diarydetailuserlogo" src="${mylist.diarycom_user.user_logo}"  style="height:45px;">
					</c:if>
					<c:if test="${mylist.diarycom_user.user_logo=='/null'}">
					<img class="diarydetailuserlogo" src="image/userlogo.png"  style="height:45px;">
					</c:if>
					<lable>${mylist.diarycom_user.user_name}</lable><br>
					<table>${mylist.diarycom_content}</table>
						<div class="timeandfloat"><table style="color: gray;">${status.index+1}楼&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;${mylist.diarycom_time}</table></div>
				
					</div>	
					</c:forEach>					
					<div class="clearfix"> </div>
				</div>
			</div>
			<c:if test="${requestScope.diarycomcount>5}">	
			<div style="text-align:center;">
			<input onclick="getotherpage('first')" title="首页" alt="首页" name="" type="button"  style="border-radius:50%; width:26px; height:26px;  border:0; background:url(image/firstone.png) no-repeat left top" />			
			<input onclick="getotherpage('reduceone')" title="上一页" alt="上一页" name="" type="button"  style="border-radius:50%; width:26px; height:26px;  border:0; background:url(image/shangone.png) no-repeat left top" />
			<font size="5;"><lable id="nowpagenum">1</lable>/${requestScope.pageCount}</font>
			<input onclick="getotherpage('addone')" title="下一页" alt="下一页" name="" type="button"  style="border-radius:50%; width:26px; height:26px;  border:0; background:url(image/nextone.png) no-repeat left top" />				
			<input onclick="getotherpage('end')" title="尾页" alt="尾页" name="" type="button"  style="border-radius:50%; width:26px; height:26px;  border:0; background:url(image/endone.png) no-repeat left top" />
			</div>
			</c:if>
			<div class="single-bottom">
			<h3>说点什么吧</h3>
				<form action="DiaryDetailServlet"  name="saysomething">
						<input type="hidden" name="flag" value="whatareyousaying">
						<input type="hidden" name="diaryid" value="${requestScope.diary.diary_id}">
						<div class="clearfix"> </div>
							<textarea id="getsaysomething" name="getsaysomething"  placeholder="Message（200字以内）" required></textarea>
							<input type="submit" value="Send" onclick="return saysomething()">
				</form>
			
		</div>
				</div>
					<div class="col-md-3 categories-grid">
				<div class="grid-categories">
					<lable><h4>${requestScope.diary.diary_place.place_name}</h4>
					${requestScope.diary.diary_place.place_content}					
					</lable>
				</div>
			</div>	
			</div>
	</div>

<!--//content-->
</body>
</html>